{include file="public/header296"}
<div class="layui-form" style="padding: 10px 0 0 0;">
  <div class="layui-form-item">
    <label class="layui-form-label">角色名称</label>
    <div class="layui-input-inline">
      <input type="text" name="name" value="{$item.name}" lay-verify="required" autocomplete="off" class="layui-input" />
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">权限范围</label>
    <div class="layui-input-block">
      <div id="test-tree-demo1"></div>
    </div>
  </div>
  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label">描述</label>
    <div class="layui-input-block">
      <input name="desc" placeholder="请输入描述" value="{$item.desc}" class="layui-input" >
    </div>
  </div>
  <div class="layui-form-item layui-hide">
    <input type="hidden" name="id" value="{$item.id}" />
    <input type="button" lay-submit lay-filter="Lay-app-form-edit" id="Lay-app-form-edit" value="编辑">
  </div>
</div>
<script>
layui.use(['tree', 'util', 'form'], function(){
  var $ = layui.$
          ,tree = layui.tree
          ,layer = layui.layer
          ,form = layui.form
          ,util = layui.util;

  var role_id = '{$item.id}';
  $.ajax({
    url: "{:url('systemMenu/getSystemMenuByChecked')}",
    type: "post",
    dataType: 'json',
    data: {role_id:role_id},
    async: false,
    success: function (res) {
      data = res.data;
    },
  });
  tree.render({
    elem: '#test-tree-demo1'
    , data: data
    , id: 'Lay-app-tree-nodes-edit'
    , showCheckbox: true
    , isJump: true
    , click: function(obj){
      var data = obj.data;
      layer.msg('状态：'+ obj.state + '<br>节点数据：' + JSON.stringify(data));
    }
  });

  // 获取所有选中的节点id
  function getCheckedId(data) {
    var ids = "";
    $.each(data, function (index, item) {
      if (ids != "") {
        ids = ids + "," + item.id;
      } else {
        ids = item.id;
      }
      // item 含有 children属性
      if (item.children != null) {
        var i = getCheckedId(item.children);
        if (i != "") {
          ids = ids + "," + i;
        }
      }
    });
    return ids;
  }

  // form.on('submit(Lay-app-form-edit)', function (data) {
  //   var checkedData = tree.getChecked('Lay-app-tree-nodes'); //获取选中节点的数据
  //   var node_ids;
  //   node_ids = getCheckedId(checkedData);
  //   console.log(node_ids);
  //   alert(node_ids);
  //   return false;
  // });
})
</script>
{include file="public/footer" /}